<template>
  <baidu-map class="map"
             :center="{lng: 113.245399, lat: 29.47934}"
             :zoom="18" :scroll-wheel-zoom="true">
    <bm-scale anchor="BMAP_ANCHOR_TOP_RIGHT">
    </bm-scale>
    <bm-navigation anchor="BMAP_ANCHOR_TOP_RIGHT">
    </bm-navigation>
    <bm-map-type
      :map-types="['BMAP_NORMAL_MAP', 'BMAP_HYBRID_MAP']"
      anchor="BMAP_ANCHOR_TOP_LEFT">
    </bm-map-type>
    <bm-marker
      :position="{lng: 113.2462, lat: 29.47838}"
      :dragging="true" animation="BMAP_ANIMATION_BOUNCE"
      :icon="{url: 'http://developer.baidu.com/map/jsdemo/img/fox.gif',
      size: {width: 300, height: 157}}">
    </bm-marker>
    <bm-marker :position="{lng: 113.244148, lat: 29.478664}" :dragging="true" @click="infoWindowOpen">
      <bm-info-window :show="show" @close="infoWindowClose" @open="infoWindowOpen">
        //设备信息<br/>
        cardid:1//IC卡ID<br/>
        deviceaddress:岳阳市云溪区人才公寓设备1//设备地址<br/>
        deviceid: 1//设备ID<br/>
        devicenumber: 7702//设备编号<br/>
        isdel: 1//是否删除<br/>
        operatorsid:25 //运营商ID<br/>
        operatorsname: 云溪市政府//运营商名称<br/>
        partnersid: 98//合伙人ID<br/>
        partnersname: kc//合伙人名称<br/>
      </bm-info-window>
    </bm-marker>

  </baidu-map>
</template>
<button></button>
<style>
  .map {
    width: 100%;
    height: 550px;
  }
</style>
<script>
  export default {
    data () {
      return {
        show: false
      }
    },
    methods: {
      infoWindowClose () {
        this.show = false
      },
      infoWindowOpen () {
        this.show = true
      }
    }
  }
</script>
